{extend name="normal_base" /}
{block name="navigation"}{/block}
{block name="css"}
<style>
    .layui-form-item{
        margin: 2px;
    }

    .layui-form input.layui-input{
        width: 200px;
    }


</style>
{/block}
{block name="body"}
<div class="x-body">
    <blockquote class="layui-elem-quote" style="color: #AAAAAA">Tip ： 双击表格中的 行 或者单击每行后面的操作按钮：<i class="layui-icon">&#xe63c;</i> 即可查看客户详细信息；导出功能是导出当前筛选条件下的全部数据</blockquote>
    <form class="layui-form layui-col-md12 x-so" action="" lay-filter="form-id"  method="get" id="search-form-id">
        <div class="layui-row">
            <div class="layui-col-md4">
                <div class="layui-form-item">
                    <label class="layui-form-label">名称：</label>
                    <div class="layui-input-inline">
                        <input type="text" name="customer_name" id="customer_name"  placeholder="" value="{$customer_name}" autocomplete="off" class="layui-input">
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">客户编号：</label>
                    <div class="layui-input-inline">
                        <input type="text" name="customer_number" id="customer_number"  placeholder="" value="{$customer_number}" autocomplete="off" class="layui-input">
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">星级：</label>
                    <div class="layui-input-inline">
                        <select name="star_level" id="star_level" lay-filter="star_level">
                            <option value=0>请选择</option>
                            {foreach name="star_level_config_info" item="vo"}
                            <option value={$vo}>{$vo}星</option>
                            {/foreach}
                        </select>
                    </div>
                </div>
            </div>

            <div class="layui-col-md4">
                <div class="layui-form-item">
                    <label class="layui-form-label">区域：</label>
                    <div class="layui-input-inline">
                        <select name="province_id" lay-filter="region" id="province">
                            <option value=0>指定省</option>
                        </select>
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label"></label>
                    <div class="layui-input-inline">
                        <select name="city_id" lay-filter="region" id="city">
                            <option value=0>指定市</option>
                        </select>
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label"></label>
                    <div class="layui-input-inline">
                        <select name="district_id" lay-filter="region" id="district">
                            <option value=0>指定县/区</option>
                        </select>
                    </div>
                </div>
            </div>

            <div class="layui-col-md4">
                <div class="layui-form-item">
                    <label class="layui-form-label">纳税人：</label>
                    <div class="layui-input-inline">
                        <select name="is_general_taxpayer" lay-filter="is_general_taxpayer" id="is_general_taxpayer">
                            <option value=-1>是否是一般纳税人</option>
                            <option value=1>是</option>
                            <option value=0>否</option>
                        </select>
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">税号：</label>
                    <div class="layui-input-inline">
                        <input type="text" name="taxpayer_identity_numbe" id="taxpayer_identity_numbe"  placeholder="" value="{$taxpayer_identity_numbe}" autocomplete="off" class="layui-input">
                    </div>
                </div>

                <!--<div class="layui-form-item">
                    <label class="layui-form-label">录入时间：</label>
                    <div class="layui-input-inline">
                        <input class="layui-input" placeholder="开始时间" name="start" id="start" value="{$start ? date('Y-m-d', $start) : ''}">
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">录入时间：</label>
                    <div class="layui-input-inline">
                        <input class="layui-input" placeholder="截止时间" name="end" id="end" value="{$end ? date('Y-m-d', $end) : ''}">
                    </div>
                </div>-->

            </div>
        </div>
    </form>
    <div style="clear:both"></div>

    <div class="layui-progress" lay-showPercent="true" lay-filter="down-progress" id="down-progress-bar" style="display: none;">
        <div class="layui-progress-bar" lay-percent="0%" id="down-progress-bar-per"></div>
    </div>

    <xblock>
        <button class="layui-btn"  lay-submit="" lay-filter="sreach" id="sreach-by-where">搜索</button>
        <button type="reset" class="layui-btn layui-btn-normal" id="reset-search">重置</button>
        <button class="layui-btn" onclick="javascript:location.replace(location.href);">刷新</button>
        <button class="layui-btn layui-btn-normal" onclick="x_admin_show('添加客户','{:url(\'add\')}')">添加</button>
        <button class="layui-btn" id="export-coustom-id">导出</button>
        <button class="layui-btn layui-btn-danger" onclick="delAll()">批量删除</button>
        <span class="x-right" style="line-height:40px">共有数据：{$customer_list->toArray()['total']} 条</span>
    </xblock>

    <table class="layui-table" lay-size="">
        <thead>
        <tr>
            <th>
                <div class="layui-unselect header layui-form-checkbox" lay-skin="primary"><i class="layui-icon">&#xe605;</i></div>
            </th>
            <th>客户编号</th>
            <th>客户单位名称</th>
            <th>客户单位简称</th>
            <!--<th>合同公司代号</th>-->
            <th>地址</th>
            <th>业务额（元）</th>
            <th>客户星级</th>
            <th>一般纳税人</th>
            <!--<th>录入时间</th>-->
            <th>操作</th>
        </tr>
        </thead>
        <tbody>
        {foreach name="customer_list" item="vo"}
        <tr class="customer-tr" data-id='{$vo.id}'>
            <td>
                <div class="layui-unselect layui-form-checkbox" lay-skin="primary" data-id='{$vo.id}'><i class="layui-icon">&#xe605;</i></div>
            </td>
            <td>{$vo.customer_number}</td>
            <td>{$vo.company_name}</td>
            <td>{$vo.short_name}</td>
            <!--<td>{$vo.sign_company_code}</td>-->
            <td>{$vo.address_prefix}&nbsp;{$vo.address}</td>
            <td>{$vo.revenue}</td>
            <td>{:str_repeat("<i class='fa fa-star' aria-hidden='true'></i>", $vo.star_level)}</td>
            <td>{$vo.is_general_taxpayer ? '是' : '否'}</td>
            <!--<td>{$vo.create_time}</td>-->
            <td class="td-manage">
                <a title="详情"  onclick="x_admin_show('详细信息','info/id/{$vo[\'id\']}')" href="javascript:;">
                    <i class="layui-icon">&#xe63c;</i>
                </a>
                <a title="编辑"  onclick="x_admin_show('编辑客户信息','edit/id/{$vo[\'id\']}')" href="javascript:;">
                    <i class="layui-icon">&#xe642;</i>
                </a>
                <a title="删除" onclick="delOne(this,{$vo.id})" href="javascript:;">
                    <i class="layui-icon">&#xe640;</i>
                </a>
            </td>
        </tr>
        {/foreach}
        </tbody>
    </table>
    {$customer_list->render()}
</div>

{/block}

{block name="script"}
<script src="__JS__/jquery.fileDownload.js"></script>
<script>
    layui.use(['laydate', 'form','layer', 'element'], function(){
        var laydate = layui.laydate;
        var element = layui.element;
        $ = layui.jquery;
        var form = layui.form
                ,layer = layui.layer;

        //执行一个laydate实例
        laydate.render({
            elem: '#start' //指定元素
        });

        //执行一个laydate实例
        laydate.render({
            elem: '#end' //指定元素
        });

        //初始化省级信息
        $.ajax({
            type: "post",
            url: "{:url('admin/region/get_region_by_parent_id', 'pid=1')}",
            dataType: "json",
            success: function(data){
                if (data.code == 1) {
                    layer.msg('获取地区清单错误，建议尝试刷新页面！',{icon:5,time:1500});
                } else {
                    var province_list = data.data;

                    var province_id = {$province_id};
                    var city_id = {$city_id};
                    var district_id = {$district_id};
                    $("#province").empty();
                    $("#province").append("<option value='0'>指定省</option>");
                    for (var i=0; i < province_list.length; i++) {
                        $("#province").append("<option value="+province_list[i]['region_id']+">"+province_list[i]['region_name']+"</option>");
                    }
                    $("#province").val(province_id);
                    form.render('select', 'form-id');

                    //加载市
                    if (province_id > 0) {
                        $.ajax({
                            type: "post",
                            url: "{:url('admin/region/get_region_by_parent_id')}" + '?pid='+province_id,
                            dataType: "json",
                            success: function(data){
                                if (data.code == 1) {
                                    layer.msg(data.msg,{icon:5,time:1500});
                                } else {
                                    var region_list = data.data;
                                    $("#city").empty();
                                    $("#city").append("<option value='0'>指定市</option>");
                                    for (var i=0; i < region_list.length; i++) {
                                        $("#city").append("<option value="+region_list[i]['region_id']+">"+region_list[i]['region_name']+"</option>");
                                    }
                                    $("#city").val(city_id);
                                    form.render('select', 'form-id');
                                }
                            }, error: function(){
                                layer.msg("请求地区清单出错",{icon:5,time:1500});
                            }
                        });
                    }

                    //加载县区
                    if (city_id > 0) {
                        $.ajax({
                            type: "post",
                            url: "{:url('admin/region/get_region_by_parent_id')}" + '?pid=' + city_id,
                            dataType: "json",
                            success: function (data) {
                                if (data.code == 1) {
                                    layer.msg(data.msg, {icon: 5, time: 1500});
                                } else {
                                    var region_list = data.data;
                                    $("#district").empty();
                                    $("#district").append("<option value='0'>指定区/县</option>");
                                    for (var i = 0; i < region_list.length; i++) {
                                        $("#district").append("<option value=" + region_list[i]['region_id'] + ">" + region_list[i]['region_name'] + "</option>");
                                    }
                                    $("#district").val(district_id);
                                    form.render('select', 'form-id');
                                }
                            }, error: function () {
                                layer.msg("请求地区清单出错", {icon: 5, time: 1500});
                            }
                        });
                    }
                }
            }, error: function(){
                layer.msg("请求地区清单出错",{icon:5,time:1500});
            }
        });

        //监听省市区下拉框选择
        form.on('select(region)', function(data){
            var pid = data.value;   //当前选中的地区id：region_id
            var type = $(data.elem).attr('id');
            if (pid > 0 && type != 'district') {

                var id = '';
                var name = '';
                if (type == 'province') {
                    id = 'city';
                    name = '市';
                    //清空区域数据，保证数据被重置
                    $('#district').empty();
                    $("#district").append("<option value='0'>请选择县/区"+"</option>");
                } else if (type == 'city') {
                    id = 'district';
                    name = '县/区';
                } else {
                    layer.msg('省市区信息异常！',{icon:5,time:1500});
                    return;
                }

                $.ajax({
                    type: "post",
                    url: "{:url('admin/region/get_region_by_parent_id')}" + '?pid='+pid,
                    dataType: "json",
                    success: function(data){
                        if (data.code == 1) {
                            layer.msg(data.msg,{icon:5,time:1500});
                        } else {
                            var region_list = data.data;
                            $("#"+id).empty();
                            $("#"+id).append("<option value='0'>指定"+name+"</option>");
                            for (var i=0; i < region_list.length; i++) {
                                $("#"+id).append("<option value="+region_list[i]['region_id']+">"+region_list[i]['region_name']+"</option>");
                            }
                            form.render('select', 'form-id');
                        }
                    }, error: function(){
                        layer.msg("请求地区清单出错",{icon:5,time:1500});
                    }
                });
            }
        });

        //初始化表单值
        $('#customer_name').val('{$customer_name}');
        $('#taxpayer_identity_numbe').val('{$taxpayer_identity_numbe}');
        $('#is_general_taxpayer').val({$is_general_taxpayer});
        $('#star_level').val({$star_level});
        $('#start').val("{$start ? date('Y-m-d', $start) : ''}");
        $('#end').val("{$end ? date('Y-m-d', $end) : ''}");

        $('#reset-search').bind('click', function () {
            $('#customer_name').val('');
            $('#customer_number').val('');
            $('#taxpayer_identity_numbe').val('');
            $('#is_general_taxpayer').val(-1);
            $('#start').val('');
            $('#end').val('');
            $('#province').val(0);
            $('#city').val(0);
            $('#district').val(0);
            form.render('select');
        });

        /*导出客户列表*/
        $('#export-coustom-id').bind('click', function () {
            layer.confirm("您确定要导出当前条件下（最近一次搜索）的：{$customer_list->toArray()['total']} 条数据吗？", function (index) {
                //Yes
                layer.close(index);
                //获取下载条件:
                //关键字：
                var customer_name = $('#customer_name').val();
                //税号：
                var taxpayer_identity_numbe = $('#taxpayer_identity_numbe').val();
                //客户编号：
                var customer_number = $('#customer_number').val();
                //指定省：
                var province_id = $('#province').val();
                //指定市：
                var city_id = $('#city').val();
                //指定地区：
                var district_id = $('#district').val();
                //星级
                var star_level = $('#star_level').val();
                //是否一般纳税人
                var is_general_taxpayer = $('#is_general_taxpayer').val();
                //开始时间-截止时间
                var start = $('#start').val();
                var end = $('#end').val();

                var url = "{:url('admin/Customer/export_customers')}" + '?customer_name=' + customer_name + '&taxpayer_identity_numbe='+taxpayer_identity_numbe + '&customer_number=' + customer_number + '&province_id='+province_id + '&city_id='+city_id + '&district_id='+district_id + '&star_level='+star_level + '&is_general_taxpayer='+is_general_taxpayer + '&start='+start + '&end='+end;

                var inter;
                var percent = 0;
                var random = 0;

                /*异步下载*/
                $.fileDownload(url,{
                    httpMethod: 'GET',
                    //data:,
                    prepareCallback:function(url){
                        $('#down-progress-bar').show();

                        inter = setInterval(function () {
                            //clearInterval(interva); 清除定时器
                            if (percent < 90) {
                                //从任意值开始 至 任意值:parseInt(Math.random()*(上限-下限+1)+下限)
                                random = parseInt(Math.random() * (6 - 3 + 1) + 3);
                                percent += random;
                                element.progress('down-progress', percent + '%');
                            }
                        }, 200);
                    },
                    successCallback:function(url){
                        clearInterval(inter);
                        element.progress('down-progress', 100 + '%');
                        setTimeout(function () {
                            $('#down-progress-bar').hide();
                        }, 3200);
                    },
                    failCallback: function (html, url) {
                        layer.msg(html,{icon:5,time:1500});
                        $('#down-progress-bar').hide();
                    }
                });
            }, function (index) {
                //Cancel
                layer.close(index);
            });
        });
    });

    /*按钮绑定提交表单*/
    $('#sreach-by-where').bind('click', function () {
        $("#search-form-id").submit();
    });

    $('.customer-tr').dblclick(function () {
        x_admin_show('详细信息','info/id/' + $(this).attr('data-id'));
    });



    /*客户-删除*/
    function delOne(obj,id){
        layer.confirm('确认要删除吗？',function(index){
            //发异步删除数据
            $.ajax({
                type: "post",
                url: "delete?ids="+id,
                dataType: "json",
                success: function(data){
                    if (data.code == 1) {
                        layer.msg(data.msg);
                    } else {
                        layer.msg('已删除!',{icon:1,time:1000});
                        $(obj).parents("tr").remove();
                    }
                }, error: function(){
                    layer.msg("请求出错",{icon:5,time:1000});
                }
            });
        });
    }

    function delAll (argument) {
        //获取选中的id
        var data = tableCheck.getData();
        if (data.length > 0) {
            layer.confirm('确认要删除吗？',function(index){
                var success = 0;
                //捉到所有被选中的，发异步进行删除
                $.ajax({
                    type: "post",
                    url: "delete?ids="+data.join(','),
                    dataType: "json",
                    success: function(data){
                        if (data.code == 1) {
                            layer.msg(data.msg,{icon:5,time:1500});
                        } else {
                            layer.msg('已删除!',{icon:1,time:1000});
                            success = 1
                        }
                    }, error: function(){
                        layer.msg("请求出错",{icon:5,time:1000});
                    }
                });

                setTimeout(function () {
                    location.replace(location.href);
                }, 1500);
            });
        } else {
            layer.msg("您还未勾选要删除的数据",{icon:5,time:1500});
        }
    }
</script>
{/block}